﻿import Taro, { Component } from '@tarojs/taro'
import { Swiper, SwiperItem, Image, View, Text } from '@tarojs/components'
import '../../assets/common.scss'
import CommonJs from '../../utils/common'
import './winningrecord.scss'
export default class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      result:[],
      pageNumber:1,
      hasNextPage:false,
      scrollPd:false,
      norecords:'',
      shopstatus:0,
      goodsstatus:0,
      shopid:"",
      dealerId:"",
      goodslist:[],
      shoplist:[],
      sureindex:[]
    }
  }
  config = {
    navigationBarTitleText: '加载中'
  }

  componentWillMount () {
    this.getdata(1);
    this.getmd();
  }
  componentDidShow () {
  }
  componentWillUnmount () {
  }
  open(url,type){
  	if(type){
	    this.$preload({
	      type:type
	    })
	  }
    CommonJs.open(url);
  }
  getdata(pageNumber){
    //获取中奖记录
    var _this = this
    var dates = {
      pageSize:10,
      pageNumber:pageNumber
    }
    // console.log(JSON.stringify(dates)+'111111111')
    CommonJs.ajaxRequest('/prizeorder/queryPrizeOrder',dates,'GET',function(res){
      // console.log(JSON.stringify(res)+'111111111')
      Taro.setNavigationBarTitle({title:"中奖记录"})
      var hasNextPage = res.content.hasNextPage
      var results = _this.state.result
      var result = res.content.result
      for(var i = 0; i < result.length; i++){
        results.push(result[i])
      }
      if (hasNextPage) {
        _this.setState({
          result:results,
          pageNumber: res.content.pageNumber,
          hasNextPage: hasNextPage,
          scrollPd: true,
          norecords:'暂无记录'
        })
      } else {
        _this.setState({
          result:results,
          pageNumber: res.content.pageNumber,
          hasNextPage: hasNextPage,
          scrollPd: false,
          norecords:'暂无记录'
        })
      }
    })
  }
  loadMore(){
    var _this = this
    var pd = _this.state.scrollPd
    if(pd) {
      //防止多次触发滑动到底部事件
      _this.setState({
        scrollPd: false//禁止下拉
      })
      var pageNumber = _this.state.pageNumber + 1
      _this.getdata(pageNumber)
    }else{
      var hasNextPage =  _this.state.hasNextPage
      if(hasNextPage){
        Taro.showToast({
          title:'正在加载数据...',
          icon: 'none',
          duration: 2000
        })
      }else{
        Taro.showToast({
          title:'没有更多数据啦！',
          icon: 'none',
          duration: 2000,
          norecords:'暂无记录'
        })
      }
    }
  }
  prizescl(obj){
    var str = ''
    var prizeType = obj.prizeType
    if (prizeType == 1) {
      str = obj.goodsName
    } else if (prizeType == 2) {
      str = obj.paycredit+'积分'
    } else if (prizeType == 3) {
      str = obj.projectName
    } else if (prizeType == 4) {
      str = '谢谢惠顾'
    } else if (prizeType == 5) {
      str = obj.paycredit+'住加币'
    } else if (prizeType == 6) {
      str = obj.paycredit+'住票'
    }
    else if (obj.prizeType == 7) {
	    	 str = obj.publishParam.name
	    }
    return str
  }
  prizelxcl(obj){
    var str = ''
    var prizeType = obj.prizeType
    if (prizeType == 1) {
      str = '商品'
    } else if (prizeType == 2) {
      str = '积分'
    } else if (prizeType == 3) {
      str = '套餐'
    } else if (prizeType == 4) {
      str = '谢谢参与'
    } else if (prizeType == 5) {
      str = '住加币'
    } else if (prizeType == 6) {
      str = '住票'
    }
    else if (obj.prizeType == 7) {
	    	 str = obj.publishParam.name
	    }
    return str
  }
  showshops(){
  	if(this.state.shoplist.length>0){
	  	this.setState({
	        shopstatus:1
	    })
	  }
  	else{
  		Taro.showToast({
	      title:"还没有需要支付的奖品哟",
	      icon: 'none',
	      duration: 2000
	    })
  	}
  }
  showgoods(shopid,dealerId){
  	var url="/commodityCoupon/getCommodityCouponByShopId";
  	var dates={
  		shopId:shopid
  	}
  	var _this=this;
  	CommonJs.ajaxRequest(url,dates,'GET',function(res){
  		var red=res.content;
  		for(var i=0;i<red.length;i++){
  			 red[i].max=red[i].amount;
  		}
      _this.setState({
	        shopid:shopid,
	        dealerId:dealerId,
	        goodsstatus:1,
	        goodslist:red
	    })
   })
  }
  closetc(){
  	this.setState({
        shopstatus:0,
        goodsstatus:0
    })
  }
  getmd(){
  	var url="/commodityCoupon/getCommodityCouponShop";
  	var _this=this;
  	CommonJs.ajaxRequest(url,'','GET',function(res){
      _this.setState({
	        shoplist:res.content
	    })
    })
  }
  choose(index){
  	var pindex=this.state.sureindex;
  	var goodslist=this.state.goodslist;
  	//console.log(JSON.stringify(goodslist));
  	var xb=pindex.indexOf(index);
  	if(xb>=0){
  		pindex.splice(xb,1);
  	}
  	else{
  		pindex.push(index);
  	}
  	this.setState({
        sureindex:pindex
    })
  	this.getpay();
  }
  getpay(){
  	var pindex=this.state.sureindex;//兑换商品次数数组
  	var goodslist=this.state.goodslist;
  	var total=0;
  	if(pindex.length>0){
  		for(var i=0;i<pindex.length;i++){
  			var a=pindex[i];
  			total=total+goodslist[a].extraprice*goodslist[a].amount;
  		}
  	}
  	return total.toFixed(2);
  }
  donum(index,type){
  	var goodslist=this.state.goodslist;
  	var pindex=this.state.sureindex;
  	if(type==1){//加
  		if(goodslist[index].amount<goodslist[index].max){
  			goodslist[index].amount=goodslist[index].amount+1;
  			var xb=pindex.indexOf(index);
		  	if(xb>=0){
		  	
		  	}
		  	else{
		  		pindex.push(index);
		  	}
  			this.setState({
		        goodslist:goodslist
		    })
  		}
  		else{
  			Taro.showToast({
          title:"不够了",
          icon: 'none',
          duration: 2000
        })
  		}
  	}
  	else{
  		if(goodslist[index].amount>1){
  			goodslist[index].amount=goodslist[index].amount-1;
  			this.setState({
		        goodslist:goodslist
		    })
  		}
  	}
  }
  sure(){
  	
  	var goodsIds=[];
  	var amounts=[];
  	var goodslist=this.state.goodslist;
  	var pindex=this.state.sureindex;
  	var total=0;
  	if(pindex.length>0){
  		this.closetc();
	  	for(var i=0;i<pindex.length;i++){
	  		var a=pindex[i];
	  		goodsIds.push(goodslist[a].goodsId);
	  		amounts.push(goodslist[a].amount);
	  		total=total+goodslist[a].extraprice*goodslist[a].amount;
	  	}
	  	this.$preload({
		    goodsIds:goodsIds,
		    amounts:amounts,
		    total:total,
		    shopid:this.state.shopid,
		    dealerId:this.state.dealerId
		  })
	    CommonJs.open('/pages/mybill/mybill');
	  }
  	else{
  		Taro.showToast({
	      title:"请选选择兑换的奖品",
	      icon: 'none',
	      duration: 2000
	    })
  	}
  }
  render () {
    const result = this.state.result
    const goodslist=this.state.goodslist
    const shoplist=this.state.shoplist
    return (
      
      	<View className='page' style="padding-top:20px;">
      		<View className='btn' onClick={this.showshops.bind(this)} style='display:none'>支付奖品余额</View>
      		<View className='bg' style={this.state.shopstatus==1||this.state.goodsstatus==1?'display:block':'display:none'}></View>
      		<View className='close' style={this.state.shopstatus==1?'display:block':'display:none'}>
      			<Text className='close-x' onClick={this.closetc.bind(this)} >x</Text>
      		</View>
      		<View className='shoplist' style={this.state.shopstatus==1?'display:block':'display:none'}>
      				<View className='shop-tit'>选择门店</View>
      				<View className='shop-list'>
      					{shoplist.length>0&&shoplist.map((item, index) => (
	      				<Text className='shop-li' onClick={this.showgoods.bind(this,item.id,item.dealerId)}>{item.name}</Text>
	      				))}
	      			</View>
      		</View>
      		<View className='shoplist' style={this.state.goodsstatus==1?'display:block':'display:none'}>
      				<View className='shop-tit'>选择兑换的奖品</View>
      				<View className='shop-list shop-listts'>
      						{goodslist.length>0&&goodslist.map((item, index) => (
	      					<View className='goods-li'>
	      						<View className={this.state.sureindex.indexOf(index)>=0?'goods-choose goods-choosecur fr':'goods-choose fr'} onClick={this.choose.bind(this,index)}></View>
	      						<View className='goods-num fr'>
	      							<Text className='jia' onClick={this.donum.bind(this,index,1)}>+</Text>
	      							<Text className='val'>{item.amount}</Text>
	      							<Text className='jian' onClick={this.donum.bind(this,index,0)}>-</Text>
	      						</View>
	      						<View className="goods-logo-box"><Image className='goods-logo' mode='widthFix' src={item.commodityLogo}></Image></View>
	      						<View className='goods-text'>
	      							<Text className='shop-li'>{item.commodityName}</Text>
	      							<Text className='shop-li shop-lits'>{item.price}积分+{item.extraprice}元</Text>
	      						</View>
	      					</View>
	      					))}
	      			</View>
	      			<View className='shop-btn'>
	      					<Text className='sure fr'  onClick={this.sure.bind(this)}>确定兑换</Text>
	      					<Text className='sure-text'>￥{this.getpay()}</Text>
	      			</View>
      		</View>
        <ScrollView scrollY='true' className='qun-znjanbg' onScrollToLower={this.loadMore.bind(this,'')}>
          {result.length > 0 ?
            result.map((item, index) => (
            <View className='qun-znjanpdg'>
              <View className='qun-znjanpd'>
              	 <View className='qun-znjanli fr'>
              	 	<View className='zt'>{item.status==3?'已兑换':'未兑换'}</View>
                  <View className='qun-znjaninfo'>
                  		{item.orderSerialno == null || item.orderSerialno == '' ?'流水号:'+item.serialno : '套餐流水号'+item.orderSerialno}
                  </View>
                </View>
                <View className='qun-znjanli' style="text-align:left;">
                  <Text className='dj'>{item.rank}等奖</Text>
                  <Text className='jp'>{this.prizescl(item)}</Text>
                  <View className='time'>{CommonJs.FormatDate(item.createAt,3)}</View>
                </View>
                {item.extraprice>0?
               	<View className='tips'>提示:此奖品还需要支付{item.extraprice}元,价值{item.goodsPrice}积分+{item.extraprice}元</View>
               	:''
                }
              </View>
            </View>
            ))
            :
            <View className='qun-norecords qun-znjiangjl'>{this.state.norecords}</View>
            }
        </ScrollView>
      </View>
    )
  }
}